/**
 * 节点输入输出展示组件
 */
<template>
  <div class="flex items-center">
    <p class="node-sub-text">{{title}}</p>
    <div class="typeof-list" ref="typeofRef">
      <Tooltip theme="light" transfer :content="question" placement="top" :disabled="!question">
        <div class="title" :style="{color:  !question && '#999'}">{{ question || '未配置提问内容' }}</div>
      </Tooltip>
    </div>
  </div>
</template>
<script setup>
import { ref, watch } from 'vue'

const props = defineProps({
  valueList: {
    type: Array,
    default: () => []
  },
  title: {
    type: String,
    default: '输入'
  },
  valueName: {
    type: String,
    default: 'value'
  },
  question: String
})

const typeofRef = ref(null)
const showMore = ref(false)
</script>

<style scoped lang="scss">
.typeof-list{
  line-height: 1;
  margin-left: 8px;
}
.title {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  max-width: 220px;
  font-size: 12px;
}
</style>
